<template>
  <BContainerFluid>
    <BRow>
        <BCard v-for="it in data_list" :key="it" class="card" :style="data_position" :title="it.title">{{it.content}}</BCard>
    </BRow>
  </BContainerFluid>
</template>

<script>
export default {
  name: 'App',
  components: {
    
  },
  data(){
    return {
        data_list:[],
        data_position:"left:1rem;top:4rem;",
    }
  },
  mounted(){
    fetch('/data',{}).then(o=>o.json()).then(o=>{
        this.data_list = o
    })
    fetch('/process',{}).then(o=>o.json()).then(o=>{
      console.log(o)
    })
  },
  methods:{
    
  }
}
</script>

<style>
.container{
    display: flex;
    flex-wrap: wrap;
}
.card{
    position: absolute;
    width:15rem;
    height: fit-content;
    max-height: 20rem;
    overflow: hidden;
    margin:1rem 0 0 1rem;
}
</style>